<template>
  <div class="edit-process">
    <el-container>
        <el-header style="height:30px;">
          工具栏
        </el-header>
        <el-container>
          <el-aside width="250px">
            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span>控件目录</span>
                </div>
                <componetBox v-bind:components="components"></componetBox> 
            </el-card>
          </el-aside>
          
          <el-main style="padding:0px">
            <editor ref="editor" class="editor"></editor>
          </el-main>
        </el-container>
    </el-container>
  </div>
</template> 

<script>
import componetBox from './editor/componentBox'
import editor from './editor/editor'

export default {
  components: {componetBox, editor},
  name: "editProcess",
  data() {
    return {
      components: [
        {
          name: '输入',
          components:[
            {
              icon: "",
              name: "表输入"
            },
            {
              icon: "",
              name: "excel输入"
            }
          ]
        },
        {
          name: '输出',
          components:[
            {
              icon: "",
              name: "表输出"
            },
            {
              icon: "",
              name: "excel输出"
            }
          ]
        },
        {
          name: '检查',
          components:[
            {
              icon: "",
              name: "普通校验"
            },
            {
              icon: "",
              name: "分支输出"
            }
          ]
        }
      ]
    };
  },
  methods: {}
};
</script>

<style>
.editor{
  height: 750px;
  width: 1200px;
}
</style>